<!DOCTYPE html>
<html lang="en">
 
<head>
	<meta charset="UTF-8">
	<title>系统用户管理</title>
	<link rel="stylesheet" href="../../js/bower_components/bootstrap/dist/css/bootstrap.min.css">
	<link rel="stylesheet" href="../../js/bower_components/bootstrap-select/dist/css/bootstrap-select.min.css">
	<link rel="stylesheet"
		href="../../js/bower_components/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css">
	<link rel="stylesheet" href="../../js/bower_components/bootstrap-table/dist/bootstrap-table.min.css">
	<link rel="stylesheet" href="../../js/bower_components/bootstrap-treeview/dist/bootstrap-treeview.min.css">

	<script src="../../js/bower_components/jquery/dist/jquery.min.js"></script>
	<script src="../../js/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
	<script src="../../js/bower_components/bootbox.min.js"></script>
	<script src="../../js/bower_components/bootstrap-select/js/bootstrap-select.js"></script>
	<script src="../../js/bower_components/bootstrap-switch/dist/js/bootstrap-switch.min.js"></script>
	<script src="../../js/bower_components/bootstrap-table/dist/bootstrap-table.min.js"></script>
	<script src="../../js/bower_components/bootstrap-table/dist/locale/bootstrap-table-zh-CN.js"></script>

	<script src="../../js/bower_components/bootstrap-treeview/dist/bootstrap-treeview.min.js"></script>
	<script src="../../js/bower_components/jquery-form-validator/form-validator/jquery.form-validator.min.js"></script>
	<script src="../../js/bower_components/moment/min/moment-with-locales.min.js"></script>

	<script>
		$(function () {
			$("#btnAdd").click(function () {
				console.log("模态框打开方法===1");
				$('#divForm').modal();
				console.log("模态框打开方法===2");
			});
			//搜索按钮
			$("#btnSearch").click(function () {
				console.log("进入搜索按钮方法");
				//获取界面当中控件的值
				var formUid = $("#txtUid").val();
				console.log(formUid);
				var formRole = $("#selRole").selectpicker('val');
				console.log(formRole);
				//整理查询条件
				var user = "?";
				if (formUid != "") {
					user += "Uid=" + formUid
					if (formRole != "" || formRole != "全部") {
						user + "&role=" + formRole
					}
				}
				else if (formRole != "") {
					if (formRole != "全部") {
						if (user != "") {
							user += "&role=" + formRole
						} else {
							user += "role" + formRole
						}
					}
				}
				console.log(user);
				//到后端去查询
				$.ajax({
					type: "get",
					data: "json",
					url: "http://121.37.241.58:8883/logic/baseInfo/sysUser/find" + user,
					success: function (res) {
						inittable(res);
					}
				})
			})

			initRole();
			inittable("");
			initRoleForm();


		});

		function initRole(){
			console.log("进入下拉框");
			$("#selRole").empty;
			$.ajax({
				type: "get",
				url: "http://121.37.241.58:8883/logic/baseInfo/sysUser/roleList",
				dataType: "json",
				success: function(res) {
					console.log("------"+res);
					if (!res.flag) {
						$.each(res, function (i, n) {

							$("#selRole").append("<option value=\"" + n.role + "\">" + n.role + "</option>")
						});
						$("#selRole").append("<option value='全部'>全部</option>");
						$("#seleRole").selectpicker('refresh');
					}
				}
			})
		}

		function initRoleForm(){
			$("#selRoleForm").empty;
			$.ajax({
				type: "get",
				url: "http://121.37.241.58:8883/logic/baseInfo/sysUser/roleList",
				dataType: "json",
				success: function (res) {
					console.log("------"+res);
					if (!res.flag) {
						$.each(res, function (i, n) {
							$("#selRoleForm").append("<option value=\"" + n.role + "\">" + n.role + "</option>")
						});
						$("#selRoleForm").selectpicker('refresh');
					}
				}
			})
		}

		function inittable(myData) {
			console.log(myData + ":默认值")
			$("#tblResult").bootstrapTable("destroy");
			var formUid = $("#txtUid").val();
			var formRole = $("#selRole").selectpicker('val');
			if (myData == "") {
				if (formUid == "" || formRole == "") {
					console.log("进入无参的方法")
					$("#tblResult").bootstrapTable({
						loadMsg: "正在加载数据....",
						url: "http://121.37.241.58:8883/logic/baseInfo/sysUser/find",
						//data:res,
						sidePagination: 'client',
						pageSize: "5",
						Pageinatin: true,
						idField: "id",
						columns: [{
							field: "uid",
							title: "登录账号",
							halign: 'center'
						}, {
							field: "nickname",
							title: "用户匿名",
							halign: 'center'
						}, {
							field: "role",
							title: "所属角色",
							halign: 'center'
						}, {
							field: "createtime",
							title: "创建时间",
							halign: 'center'
						}]

					})
				} else {
					console.log("进入无参的方法")

					$("#tblResult").bootstrapTable({
						loadMsg: "正在加载数据....",
						//url:"http://121.37.241.58:8883/logic/baseInfo/sysUser/find",
						data: myData,
						sidePagination: 'client',
						pageSize: "5",
						Pageinatin: true,
						idField: "id",
						columns: [{
							field: "uid",
							title: "登录账号",
							halign: 'center'
						}, {
							field: "nickname",
							title: "用户匿名",
							halign: 'center'
						}, {
							field: "role",
							title: "所属角色",
							halign: 'center'
						}, {
							field: "createtime",
							title: "创建时间",
							halign: 'center'
						}]
					})
				}
			} else {
				console.log("进入条件查询");
				$("#tblResult").bootstrapTable({
					loadMsg: "正在加载数据....",
					//url:"http://121.37.241.58:8883/logic/baseInfo/sysUser/find",
					data: myData,
					sidePagination: 'client',
					pageSize: "5",
					Pageinatin: true,
					idField: "id",
					columns: [{
						field: "uid",
						title: "登录账号",
						halign: 'center'
					}, {
						field: "nickname",
						title: "用户匿名",
						halign: 'center'
					}, {
						field: "role",
						title: "所属角色",
						halign: 'center'
					}, {
						field: "createtime",
						title: "创建时间",
						halign: 'center'
					}]
				})
			}
		}
	</script>
</head>

<body>
	<div class="container-fluid">
		<!--查询区域-->
		<div class="row col-md-10">
			<div id="SearchForm" class="form-inline">
				<div class="input-group">
					<label for="txtUid" class="control-label">用户名</label>
					<input type="text" id="txtUid" />
				</div>
				<div class="input-group">
					<label class="control-label" for="selRole">用户权限</label>
					<select id="selRole"></select>
				</div>
				<div class="form-group">
					<button type="buttton" id="btnSearch" class="btn btn-primary">搜索</button>
				</div>
			</div>
		</div>
		<!--列表区域-->
		<div class="row col-md-10">
			<table id="tblResult"></table>
		</div>
	</div>
	<!--模态框的使用-->
	<div class="modal fade" id="divForm" tabindex="-1" role="dialog aria-labelledby=myModal" aria-didden="false">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
					<h4 class="modal-title" id="modalTitle">用户信息</h4>
				</div>
				<div class="modal-boody form-inline">
					<div class="form-group">
						<label class="control-label" for="txtUidForm">登录账号</label>
						<input type="text" id="txtUidForm" style="width:220px" class="form-control" />
					</div>
					<div class="form-group">
						<label class="control-label" for="txtNickname">用户匿名</label>
						<input type="text" id="txtNickname" style="width:220px" class="form-control" />
					</div>
					<div class="form-group">
						<label class="control-label" for="selRoleForm">所属角色</label>
						<select id="selRoleForm"></select>
					</div>

					<!--功能区域-->
					<div style="margin-top: 5px;" class="form-inline">
						<div id="btnTools">
							<button type="button" id="btnAdd" class="btn btn-success">新增</button>
						</div>
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
						<button type="button" class="btn btn-primary">保存</button>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>

</html>